<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <style>
       .box{
           height: 40px;
           border-top: 3px solid orangered;
           border-bottom: 1px solid gray;
       }
       .box>a{
           width: 100px;
           height: 40px;
           display: inline-block;
           text-align: center;
           line-height: 40px;
       }
       .box a{
            text-decoration: none;
            color: rgb(66, 64, 64);
       }
       .box a:hover{
        background-color: rgb(180, 173, 173);
        color: orangered;
       }
    </style>
    <body>
        <div class="box">
            <a href="#">新浪导航</a>
            <a href="#">新浪导航</a>
            <a href="#">新浪导航</a>
            <a href="#">新浪导航</a>
        </div>
    </body>
</html>